<template>
  <div>
    <custom-title :is-line="true" title="企业安全信息" />

    <div class="qyaqxx">
      <div v-for="(item, index) in descList" :key="index + '1'">
        <custom-details-item :key="index" :icon="item.icon" :label="item.label" :value="item.value + ''" />
      </div>
    </div>
    <custom-title :is-line="true" title="企业安全生产标准化建设情况" />

    <div class="qyaqscbzhjsqk">
      <div v-for="(item, index) in descList1" :key="index + '2'">
        <template>
          <custom-details-item :key="index" :icon="item.icon" :label="item.label">
            <template #valueSlot>
              <span v-if="!item.isFile">{{ item.value }}</span>
              <div v-else class="value">
                <el-link type="primary" @click="openAttachPopUp(item.value,'attachPopup2')">查看</el-link>
              </div>
            </template>
          </custom-details-item>
        </template>
      </div>
    </div>
    <custom-title :is-line="true" title="企业安全生产许可证信息" />
    <div class="qyaqscxkzxx">
      <div v-for="(item, index) in descList2" :key="index + '3'">
        <custom-details-item :key="index" :icon="item.icon" :label="item.label">
          <template #valueSlot>
            <span v-if="!item.isFile">{{ item.value }}</span>
            <div v-else class="value">
              <el-link type="primary" @click="openAttachPopUp(item.value,'attachPopup1')">查看</el-link>
            </div>
          </template>
        </custom-details-item>
      </div>
    </div>
    <custom-title :is-line="true" title="企业荣誉信息" />
    <div v-if="listData.length > 0" class="common_list honorList" style="padding: 0">
      <div v-for="(item, index) in listData" :key="index" class="list_item">
        <div class="content_area">
          <div class="number_order">{{ index + 1 }}</div>
          <div class="right_content">
            <div class="content_title" style="max-width: 100%">{{ item.companyHonorName }}</div>
            <ul>
              <li>
                <i class="iconfont c-text-color2">&#xe725;</i>
                <div class="label">荣誉证书：</div>
                <div class="value">
                  <el-link type="primary" @click="openAttachPopUp(item.fileList,'attachPopup')">查看</el-link>
                  <!--                  <el-link style="margin-right: 5px" type="primary" @click="handleDownLoad(item.attachUuid)">{{ item.attachName }}</el-link>-->
                </div>
              </li>
              <li>
                <i class="iconfont c-text-color3">&#xe617;</i>
                <div class="label">颁发日期：</div>
                <div class="value">{{ item.issueDate }}</div>
              </li>
              <li>
                <i class="iconfont c-text-color4">&#xe790;</i>
                <div class="label">颁发单位：</div>
                <div class="value">{{ item.issueUnit }}</div>
              </li>
            </ul>
          </div>
        </div>
      </div>
    </div>
    <el-empty v-else />
    <!--    <div v-else class="text-center text-muted my-1">暂无企业荣誉信息</div>-->
    <!-- 禅道 6896 7535 -->
    <!-- <custom-title :is-line="true" title="风险四色图">
      <template #right>
        <div @click="showPicker = true">
          <el-input suffix-icon="el-icon-caret-bottom" :value="timeSet" readonly size="mini" />
        </div>
      </template>
    </custom-title>
    <div v-if="riskImgList.length > 0">
      <div v-for="(item, index) in riskImgList" :key="index">
        <img :src="item" alt="" class="w-100 h-100 d-block">
      </div>
    </div>
    <el-empty v-else /> -->
    <!-- <div v-else class="text-center text-muted my-1">暂无风险四色图</div> -->
    <van-popup v-model="showPicker" round position="bottom">
      <van-picker
        title="标题"
        show-toolbar
        :columns="columns"
        value-key="factoryname"
        @confirm="onConfirm"
        @cancel="onCancel"
        @change="onChange"
      />
    </van-popup>
    <attach-pop-up ref="attachPopup" file-url-key="attachUuid" file-name-key="attachName" />
    <attach-pop-up ref="attachPopup1" file-url-key="attachUuid" file-name-key="attachName" />
    <attach-pop-up ref="attachPopup2" file-url-key="fileUrl" file-name-key="fileName" />
  </div>
</template>

<script>
import commonList from '@/assets/mixin/commonList'
import {
  aqCompanyInfo,
  aqSecurityPermitInfo,
  aqStandardConstructionInfo,
  companyFactory,
  companyRiskFile,
  getCompanyHonorList
} from '@/api/enterprise'
import AttachPopUp from '@/components/globals/attachPopUp.vue'

export default {
  name: 'SafetyComponent',
  components: { AttachPopUp },
  inject: ['layout'],
  mixins: [commonList],
  data() {
    return {
      companyName: '',
      companyId: '',
      descList: [
        {
          label: '企业分类',
          icon: '&#xe790;',
          value: '/',
          fieldName: 'categorize'
        },
        {
          label: '安全管理人员数量',
          icon: '&#xe61c;',
          value: '/',
          fieldName: 'securityPersonCount'
        },
        {
          label: '安全生产管理人',
          value: '/',
          icon: '&#xe60d;',
          fieldName: 'securityHead'
        },
        {
          label: '联系电话',
          value: '/',
          icon: '&#xe60a;',
          fieldName: 'securityHeadPhone'
        }
      ],
      descList1: [
        {
          label: '安全生产标准化等级',
          icon: '&#xe626;',
          value: '/',
          fieldName: 'standardConstructionLevelName'
        },
        {
          label: '安全生产标准化证书编号',
          icon: '&#xe629;',
          value: '/',
          fieldName: 'certifyCode'
        },
        {
          label: '证书颁发时间',
          icon: '&#xe685;',
          value: '/',
          fieldName: 'issueTime'
        },
        {
          label: '证书有效期截止时间',
          icon: '&#xe685;',
          value: '/',
          fieldName: 'expiryTime'
        },
        {
          label: '安全生产标准化证书',
          icon: '&#xe629;',
          value: '/',
          fieldName: 'attachUuid',
          isFile: true
        }
      ],
      descList2: [
        {
          label: '安全生产许可证编号',
          icon: '&#xe629;',
          value: '/',
          fieldName: 'permitCode'
        },
        {
          label: '许可范围',
          value: '/',
          icon: '&#xe64e;',
          fieldName: 'permitLimit'
        },
        {
          label: '证书有效期（起）',
          value: '/',
          icon: '&#xe685;',
          fieldName: 'validityPeriodStart'
        },
        {
          label: '证书有效期（止）',
          value: '/',
          icon: '&#xe685;',
          fieldName: 'validityPeriodEnd'
        },
        {
          label: '安全生产许可证',
          icon: '&#xe629;',
          value: '/',
          fieldName: 'attachUuid',
          isFile: true
        }
      ],
      riskImgList: [], // 风险四色图
      listData: [],
      factoryId: '',
      showPicker: false,
      columns: [],
      timeSet: '请选择'
    }
  },
  created() {
    const { companyId } = this.$route.query
    this.companyId = companyId || ''
  },
  mounted() {
    this.companyInfoSafety()
    this.aqSecurityPermitInfo()
    this.getCompanyHonorList()
    this.aqStandardConstructionInfo()
    this.companyFactory()
  },
  methods: {
    // 获取企业详情数据--基本信息
    async companyInfoSafety() {
      this.layout.showAreaLoading(['.qyaqxx'])
      const { status, data } = await aqCompanyInfo({ companyId: this.companyId })
      if (status === 0 && data) {
        this.companyName = data.companyName
        this.descList.forEach((v) => {
          // 描述列表
          v.value = data[v.fieldName] ? data[v.fieldName] : ''
        })
      }
      this.layout.hideAreaLoading(['.qyaqxx'])
    },
    // 企业生产许可证信息
    async aqSecurityPermitInfo() {
      this.layout.showAreaLoading(['.qyaqscxkzxx'])
      const { status, data } = await aqSecurityPermitInfo({ companyId: this.companyId })
      if (status === 0 && data) {
        this.descList2.forEach((v) => {
          !v.isFile ? v.value = data[v.fieldName] ? data[v.fieldName] : '' : v.value = data.attachName === '/' ? [] : [{ attachName: data.attachName, attachUuid: data.attachUuid }]
        })
      }
      this.layout.hideAreaLoading(['.qyaqscxkzxx'])
    },
    // 企业安全生产标准化建设情况
    async aqStandardConstructionInfo() {
      this.layout.showAreaLoading(['.qyaqscbzhjsqk'])
      const { status, data } = await aqStandardConstructionInfo({ companyId: this.companyId })
      if (status === 0 && data !== '') {
        this.descList1.forEach((v) => {
          !v.isFile ? v.value = data[v.fieldName] ? data[v.fieldName] : [] : v.value = data['shareAttachVos']
        })
      } else {
        this.descList1.forEach((v) => {
          v.isFile ? v.value = [] : v.value = '/'
        })
      }
      this.layout.hideAreaLoading(['.qyaqscbzhjsqk'])
    },
    // 企业荣誉信息
    async getCompanyHonorList() {
      // this.layout.showAreaLoading(['.honorList'])
      const { status, data } = await getCompanyHonorList({ companyId: this.companyId })
      if (status === 0 && data) {
        this.listData = data
        this.listData.forEach(item => {
          item.fileList = [{ attachName: item.attachName, attachUuid: item.attachUuid }]
        })
      }
      // this.layout.hideAreaLoading(['.honorList'])
    },
    // 企业厂区列表
    async companyFactory() {
      const { status, data } = await companyFactory({
        companyId: this.companyId
      })
      if (status === 0 && data) {
        this.columns = data
        this.timeSet = data.length ? data[0].factoryname : ''
        this.factoryId = data.length ? data[0].factoryid : ''
        this.companyRiskFile()
      }
    },
    // 获取风险四色图
    async companyRiskFile() {
      const { status, data } = await companyRiskFile({
        companyId: this.companyId,
        factoryId: this.factoryId
      })
      if (status === 0 && data) {
        this.riskImgList = [data]
      } else {
        this.riskImgList = []
      }
    },
    onConfirm(v) {
      this.factoryId = v.factoryid
      this.timeSet = v.factoryname
      this.showPicker = false
      this.companyRiskFile()
    },
    onCancel() {
      this.showPicker = false
    },
    onChange() {
    }
  }
}
</script>

<style lang="scss" scoped></style>
